<!DOCTYPE html>
<html lang="en"  xmlns:th="http://www.thymeleaf.org">
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="Mosaddek">
    <meta name="keyword" content="FlatLab, Dashboard, Bootstrap, Admin, Template, Theme, Responsive, Fluid, Retina">
    <link rel="shortcut icon" href="newtemplatesfiles5/img/favicon.html">

    <title>我的钱包</title>

    <!-- Bootstrap core CSS -->
    <link href="newtemplatesfiles5/css/bootstrap.min.css" rel="stylesheet">
    <link href="newtemplatesfiles5/css/bootstrap-reset.css" rel="stylesheet">
    <!--external css-->
    <link href="newtemplatesfiles5/assets/font-awesome/css/font-awesome.css" rel="stylesheet" />
    <!-- Custom styles for this template -->
    <link href="newtemplatesfiles5/css/style.css" rel="stylesheet">
    <link href="newtemplatesfiles5/css/style-responsive.css" rel="stylesheet" />

    <!-- HTML5 shim and Respond.js IE8 support of HTML5 tooltipss and media queries -->
    <!--[if lt IE 9]>
    <script src="newtemplatesfiles5/js/html5shiv.js"></script>
    <script src="newtemplatesfiles5/js/respond.min.js"></script>
    <![endif]-->
    <!--webuoploader-->
    <link rel="stylesheet" type="text/css" href="webuploader/css/webuploader.css" />
    <link rel="stylesheet" type="text/css" href="webuploader/examples/image-upload/style.css" />
    <!--弹出框style-->
    <style>
        /*弹出层*/
        #popBox {
            display: none;
            background-color: honeydew;
            z-index: 11;
            width: 400px;
            height: 200px;
            position:fixed;
            top:0;
            right:0;
            left:0;
            bottom:0;
            margin:auto;
        }

        #popBox .close{
            text-align: right;
            margin-right: 5px;
            background-color: #F8F8F8;
        }

        /*关闭按钮*/
        #popBox .close a {
            text-decoration: none;
            color: red;
        }

        #popBox .auto {
            margin-left: 50px;
            margin-right: 50px;
            margin-top: 50px;

        }

    </style>
</head>

<body>

<section id="container" class="">
    <!--header start-->
    <div th:insert="common/student-common-header::top"></div>
    <!--header end-->
    <!--sidebar start-->
    <div th:insert="common/student-common-sidebar::#left"></div>
    <!--sidebar end-->
    <!--main content start-->
    <section id="main-content">
        <section class="wrapper">
            <!-- page start-->
            <div class="row">
                <!--schoolCounsellor-stuEibck-left  start-->
                <div th:insert="common/student-sell-left::#student-sell-left"></div>
                <!--schoolCounsellor-stuEibck-left  end-->
                <aside class="profile-info col-lg-9">
                    <!--widget start-->
                    <section class="panel" >
                        <div class="bio-graph-heading">
                            <h1>我的钱包</h1>
                        </div><br>
                        <!--wallet start-->
                        <div class="weather-bg">
                            <div class="panel-body">
                                <div class="row">
                                    <div class="col-xs-6">
                                        <i class="icon-jpy"></i>
                                        余额
                                    </div>
                                    <div class="col-xs-6">
                                        <div class="degree">
                                            <a style="color: white" th:text="${session.myWallet.amount}">0.00</a>元
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <footer class="weather-category" style="background-color: grey">
                            <ul>
                                <li class="active">
                                    <h5><a href="#" style="color: white">提现</a></h5>
                                </li>
                                <li>
                                    <h5><a  href="#" style="color: white" onclick="seeRecords()">支付记录</a></h5>
                                </li>
                                <li>
                                    <h5><a style="color: white" href="#" onclick="popBox()">充值</a></h5>
                                </li>
                            </ul>
                        </footer>
                        <!--wallet end-->
                        <!--pay records start-->


                    </section>
                    <section id="recordsSection" class="panel" style="display: none">
                        <table class="table">
                            <thead>
                            <td>时间</td>
                            <td>类型</td>
                            <td>金额</td>
                            </thead>
                            <tbody>
                            <tr th:each="emp:${session.payRecords}">
                                <td th:text="${emp.tradeRecords.payTime}"></td>
                                <td th:text="${emp.type}"></td>
                                <td th:text="${emp.tradeRecords.amount}"></td>
                            </tr>
                            </tbody>

                        </table>
                    </section>
                    <script>
                        function seeRecords(){
                            var ccss = document.getElementById("recordsSection").style.display;
                            if(ccss=="none"){
                                document.getElementById("recordsSection").style.display="block";
                            }else{
                                document.getElementById("recordsSection").style.display="none";
                            }
                        }
                    </script>

                    <!--pay records end-->

                </aside>
            </div>
            <div id="popLayer"></div>
            <div id="popBox">
                <div class="close">
                    <a href="javascript:void(0)" onclick="closeBox()">关闭</a>
                </div>
                <form id="myForm">
                    <div class="auto">
                        <label>充值金额：(1.00--9999.99)</label><input class="form-control" type="text" name="amount" onblur="check(this)">
                    </div>
                    <script>
                        var checkRes = 'ok';
                        function check(obj){
                            var text = obj.value;
                            var exp = /(^[1-9][0-9]{0,3}$|^[1-9][0-9]{0,3}\.[0-9]{1,2}$)/g;
                            var res = exp.test(text);
                            if(!res){
                                checkRes="金额格式错误";
                                alert("金额格式错误");
                            }else{
                                checkRes="ok";
                            }
                        }
                    </script>
                </form>
                <div style="margin-left: 100px;margin-top: 20px">
                    <button class="btn btn-danger" onclick="yesInvest()">确认充值</button>
                </div>

            </div>
            <!--弹出框js-->
            <script>

                function yesInvest() {
                    if(checkRes!="ok"){
                        alert(checkRes);
                    }else{
                        var form = new FormData(document.getElementById("myForm"));
                        alert("确认充值吗？");
                        $.ajax({
                            url:"student-invest.do",
                            type:"post",
                            dataType:"html",
                            data:form,
                            cache:false,
                            async: false, // 是否异步
                            processData:false,
                            contentType:false,
                            success: function (data) {
                                if(data == "success"){
                                    alert("充值成功！");
                                    location.href="student-getMyWallet.do";
                                }else{
                                    alert(data);
                                }
                            },
                            error:function (data) {
                                alert("系统错误");
                            }
                        })
                    }

                }

                /*点击弹出按钮*/
                function popBox() {
                    var popBox = document.getElementById("popBox");
                    var popLayer = document.getElementById("popLayer");
                    popBox.style.display = "block";
                    popLayer.style.display = "block";
                };


                /*点击关闭按钮*/
                function closeBox() {
                    var popBox = document.getElementById("popBox");
                    var popLayer = document.getElementById("popLayer");
                    popBox.style.display = "none";
                    popLayer.style.display = "none";
                }
            </script>
        </section>
    </section>
    <!--main content end-->

</section>
<!--webuploader-->
<script type="text/javascript" src="webuploader/examples/image-upload/jquery.js"></script>
<script type="text/javascript" src="webuploader/dist/webuploader.js"></script>
<script type="text/javascript" src="webuploader/examples/image-upload/upload.js"></script>

<!-- js placed at the end of the document so the pages load faster -->
<script src="newtemplatesfiles5/js/bootstrap.min.js"></script>
<script src="newtemplatesfiles5/assets/jquery-knob/js/jquery.knob.js"></script>


<!--common script for all pages-->
<script src="newtemplatesfiles5/js/common-scripts.js"></script>

<script>
    window.onload=function(){
        $("#li1").removeClass('active');
        $("#li2").removeClass('active');
        $("#li3").removeClass('active');
        $("#li4").removeClass('active');
        $("#li5").removeClass('active');
        $("#li6").addClass('active');

    };
    //knob
    $(".knob").knob();


    function mysubmit(){
        var form = new FormData(document.getElementById("walletForm"));
        $.ajax({
            url:"student-uploadGoodsEbick.do",
            type:"post",
            dataType:"html",
            data:form,
            cache:false,
            processData:false,
            contentType:false,
            success: function (data) {
                if(data=="success"){
                    alert("开通成功！");
                    location.href="student-getMyWallet.do";
                }else {
                    alert(data);
                }
            },
            error:function (e) {
                console.log(e);
                alert("开通成功");
            }
        })
    };


</script>




</body>
</html>
